<ui:composition template="/faces/geral/layout.xhtml" 
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:t="http://myfaces.apache.org/tomahawk"	
	xmlns:rich="http://richfaces.org/rich"
	xmlns:a4j="http://richfaces.org/a4j">

	<ui:define name="content">
	
		<h:form id="cadastrarLaudoForm">
			
			<h:panelGrid columns="4" cellpadding="0" columnClasses="atendimento-filter-col-right, atendimento-filter-col-left, atendimento-filter-col-right, atendimento-filter-col-left">
				<h:outputText value="#{msg['atendimento.paciente']}" styleClass="output-text"/>
				<h:panelGrid columns="2" cellpadding="0" cellspacing="0">
					<h:inputText id="nomePaciente" value="#{laudoBean.atendimento.paciente.nome}" size="70" disabled="true" styleClass="input-text" style="width:372px"/>
					<a4j:commandLink>
						<f:ajax listener="#{laudoBean.showPopupPaciente}" event="click" execute="@this" render="pacientePopupForm:pacienteDataTable"/>
						<h:graphicImage library="images" name="icons/search-blue.png" styleClass="image-link" alt="search"/>
						<rich:componentControl event="click" target="pacientePopup" operation="show">
		                    <a4j:param name="event" value="event" noEscape="true" />
		                    <rich:hashParam>
		                    	<a4j:param noEscape="true" name="top" value="jQuery(#{rich:element('nomePaciente')}.parentNode).offset().top + jQuery(#{rich:element('nomePaciente')}.parentNode).height()" />
		                        <a4j:param noEscape="true" name="left" value="jQuery(#{rich:element('nomePaciente')}.parentNode).offset().left" />
		                 	</rich:hashParam>
						</rich:componentControl>
					</a4j:commandLink> 				
				</h:panelGrid>
				<h:outputText value="#{msg['geral.data']}" styleClass="output-text"/>
				<h:inputText value="#{laudoBean.atendimento.data}" size="10" disabled="true" styleClass="input-text">
					<f:convertDateTime pattern="#{msg['geral.formato.data']}"/>
				</h:inputText>
				
				<h:outputText value="#{msg['atendimento.medico.requisitante']}" styleClass="output-text"/>
				<h:panelGrid columns="2" cellpadding="0" cellspacing="0">
					<h:inputText id="nomeMedico" value="#{laudoBean.atendimento.medicoRequisitante.nome}" size="70" disabled="true" styleClass="input-text" style="width:372px"/>
					<a4j:commandLink>
						<f:ajax listener="#{laudoBean.showPopupMedico}" event="click" execute="@this" render="medicoPopupForm:medicoDataTable"/>
						<h:graphicImage library="images" name="icons/search-blue.png" styleClass="image-link" alt="search"/>
						<rich:componentControl event="click" target="medicoPopup" operation="show">
		                    <a4j:param name="event" value="event" noEscape="true" />
		                    <rich:hashParam>
		                    	<a4j:param noEscape="true" name="top" value="jQuery(#{rich:element('nomeMedico')}.parentNode).offset().top + jQuery(#{rich:element('nomeMedico')}.parentNode).height()" />
		                        <a4j:param noEscape="true" name="left" value="jQuery(#{rich:element('nomeMedico')}.parentNode).offset().left" />
		                 	</rich:hashParam>
						</rich:componentControl>
					</a4j:commandLink> 				
				</h:panelGrid>
				<h:outputText value="#{msg['atendimento.convenio']}" styleClass="output-text"/> 
				<h:selectOneMenu value="#{laudoBean.atendimento.convenio}" converter="entityConverter" styleClass="select-one-menu">
					<f:selectItem itemLabel="#{msg['geral.selecione.opcao']}"/>
					<t:selectItems value="#{laudoBean.convenios}" var="convenio" itemValue="#{convenio}" itemLabel="#{convenio.nome}"/>
				</h:selectOneMenu>				

				<h:outputText value="#{msg['atendimento.exame']}" styleClass="output-text"/> 
				<h:selectOneMenu value="#{laudoBean.atendimento.exame}" converter="entityConverter" styleClass="select-one-menu">
					<f:selectItem itemLabel="#{msg['geral.selecione.opcao']}"/>
					<t:selectItems value="#{laudoBean.exames}" var="exame" itemValue="#{exame}" itemLabel="#{exame.nome}"/>
				</h:selectOneMenu>				
				<h:outputText />
				<h:outputText />
			</h:panelGrid>
						
			<div id="spacer-15"/>
						
			<h:panelGrid styleClass="conteudo-laudo">
				<h:panelGrid columns="2" cellpadding="0" cellspacing="0" columnClasses="conteudo-col-conteudo, conteudo-col-modelo">
					<h:outputText value="Preparo" styleClass="conteudo-header" />
					<h:outputText value="Modelos de Preparo" styleClass="conteudo-header"/>
					
					<h:panelGrid columns="2" cellpadding="0" cellspacing="0" columnClasses="conteudo-col-conteudo, conteudo-col-save">
						<h:inputTextarea styleClass="conteudo-text-area"/>
						<h:graphicImage library="images" name="icons/save-blue.png"/>
					</h:panelGrid>
					
					<h:selectOneListbox styleClass="conteudo-select">
						<f:selectItem itemLabel="Preparo 1"/>
						<f:selectItem itemLabel="Preparo 1"/>
						<f:selectItem itemLabel="Preparo 2"/>
						<f:selectItem itemLabel="Preparo 1"/>
						<f:selectItem itemLabel="Preparo 1"/>
					</h:selectOneListbox>
				</h:panelGrid>						
			</h:panelGrid>
						
			<div id="spacer-15"/>
						
				
			<h:panelGrid columns="2" cellpadding="2" styleClass="laudo-buttons">
				<h:commandLink value="#{msg['geral.salvar']}" action="#{laudoBean.saveLaudo}" styleClass="button button-save"/>
				<h:commandLink value="#{msg['laudo.visualizar.laudo']}" action="#{laudoBean.saveLaudo}" styleClass="button button-new"/>
			</h:panelGrid>
						
		</h:form>

		<rich:popupPanel id="pacientePopup" modal="false" resizeable="false" followByScroll="false" moveable="false" width="380" height="380">
	        <f:facet name="header">
	            <h:outputText value="#{msg['laudo.pacientes']}" />
	        </f:facet>
	        <f:facet name="controls">
	            <h:outputLink onclick="#{rich:component('pacientePopup')}.hide(); return false;" >
	            	<h:graphicImage library="images" name="icons/close-popup.gif" styleClass="image-link" alt="close"/>
	            </h:outputLink>
	        </f:facet>
			<h:form id="pacientePopupForm">
	
				<h:inputText value="#{laudoBean.nomeFiltro}" size="66" styleClass="input-text">
					<f:ajax listener="#{laudoBean.searchPaciente}" event="keyup" render="pacienteDataTable" execute="@this"/>
				</h:inputText>
	
				<div id="spacer-5"/>
				
				<t:dataTable id="pacienteDataTable" var="paciente" value="#{laudoBean.pacientes}"  rows="#{laudoBean.pageSize}" width="100%"
					styleClass="tomahawk-data-table-min" headerClass="tomahawk-data-table-header-min" rowClasses="tomahawk-data-table-row-min" 
					columnClasses="laudo-col-selecionar, laudo-col-paciente">
					<h:column>
						<a4j:commandLink oncomplete="#{rich:component('pacientePopup')}.hide(event); return false;" render="nomePaciente">
							<h:graphicImage library="images" name="icons/selection-blue.png" styleClass="image-link" alt="select"/>
							<f:setPropertyActionListener value="#{paciente}" target="#{laudoBean.atendimento.paciente}" />
						</a4j:commandLink>
					</h:column>
					<h:column>
						<h:outputText value="#{paciente.nome}"/>
					</h:column>
				</t:dataTable>			
			</h:form>
	    </rich:popupPanel>
	    
		<rich:popupPanel id="medicoPopup" modal="false" resizeable="false" followByScroll="false" moveable="false" width="380" height="380">
	        <f:facet name="header">
	            <h:outputText value="#{msg['laudo.medicos']}" />
	        </f:facet>
	        <f:facet name="controls">
	            <h:outputLink onclick="#{rich:component('medicoPopup')}.hide(); return false;" >
	            	<h:graphicImage library="images" name="icons/close-popup.gif" styleClass="image-link" alt="close"/>
	            </h:outputLink>
	        </f:facet>
			<h:form id="medicoPopupForm">
	
				<h:inputText value="#{laudoBean.nomeFiltro}" size="66" styleClass="input-text">
					<f:ajax listener="#{laudoBean.searchMedico}" event="keyup" render="medicoDataTable" execute="@this"/>
				</h:inputText>
	
				<div id="spacer-5"/>
				
				<t:dataTable id="medicoDataTable" var="medico" value="#{laudoBean.medicos}"  rows="#{laudoBean.pageSize}" width="100%"
					styleClass="tomahawk-data-table-min" headerClass="tomahawk-data-table-header-min" rowClasses="tomahawk-data-table-row-min" 
					columnClasses="laudo-col-selecionar, laudo-col-medico">
					<h:column>
						<a4j:commandLink oncomplete="#{rich:component('medicoPopup')}.hide(event); return false;" render="nomeMedico">
							<h:graphicImage library="images" name="icons/selection-blue.png" styleClass="image-link" alt="select"/>
							<f:setPropertyActionListener value="#{medico}" target="#{laudoBean.atendimento.medicoRequisitante}" />
						</a4j:commandLink>
					</h:column>
					<h:column>
						<h:outputText value="#{medico.nome}"/>
					</h:column>
				</t:dataTable>			
			</h:form>
	    </rich:popupPanel>	    
 	</ui:define>
</ui:composition>
